<template>
    <div id="container">
        <van-row class="comment">
            <!-- 返回按钮 -->
            <van-nav-bar
                @click-left="goHome"
                title="投票"
                style="font-weight: bold"
                fixed>
            <template #left>
                <van-icon name="revoke" color="#fdc03a" size="20" />
            </template>
            </van-nav-bar>
        </van-row>
        <van-cell-group class="formArea">
            <!-- 正文 -->
            <!-- <div style="">
                <textarea class="textarea" placeholder="点击输入正文" cols="30" rows="10" style="resize: none;"></textarea>
            </div> -->
            <van-field
                v-model="message"
                rows="2"
                autosize
                label="留言"
                type="textarea"
                maxlength="100"
                placeholder="请输入留言"
                show-word-limit
            />
        </van-cell-group>
        <!-- 发布按钮 -->
        <van-button round type="warning" style="background-color: #fdc03a;" class="btn" @click="CommentData()">评论</van-button>
    </div>
</template>

<script>
import { Notify } from 'vant';
export default {
    data() {
        return {
            checkedComment: true,
            checkedNumber: false,   
            data:[],
            text: '',
            message: '',
            uname: ''
        }
    },
    mounted(){
        this.getData()
        console.log(this.uname);
    },
    methods: {
        goHome() {
            this.$router.go(-1);
        },
        getData(){
            this.axios.get(`http://39.108.211.154:8080/user_username?username=${this.$store.state.user}`).then(res => {
                console.log(res);
                this.uname = res.data[0].uname
            })
        },
        CommentData(){
            if (this.message == "") {
                Notify({ type: 'danger', message: '内容不能为空', duration: '2000' });
                return
            }
            console.log(this.uname);
            let params = `det_uname=${this.uname}&ctext=${this.message}&clike=0&c_did=${this.$route.query.com_did}`
            let url = `http://39.108.211.154:8080/write_comment`
            this.axios.post(url, params).then(res => {
                console.log(res);
            })
            this.$router.go(-1)
        }
    }
}
</script>

<style lang="scss">
#container {
    margin: 12px;
    height: 98vh;
    position: relative;

    .formArea {
        margin-top: 50px;

        .textarea {
            box-sizing: border-box;
            box-shadow: 0 0 3px 0px;
            width: 100%;
            // background-color: #f5f5f5;
            border: 1px solid cornflowerblue;
        }

        .pset {
            border-bottom: 1px solid darkgrey;
            // background-color: #f5f5f5;
            padding: 20px;
        }
    }

    .btn {
        width: 80%;
        transform: translateX(10%);
        position: absolute;
        bottom: 0;

    }

    .openComment {
        border-bottom: 1px solid darkgrey;
        // background-color: #f5f5f5;
        padding: 20px;
    }

    .PJ {
        border-bottom: 1px solid darkgrey;
        // background-color: #f5f5f5;
        padding: 20px;
    }

    .openNumber {
        border-bottom: 1px solid darkgrey;
        // background-color: #f5f5f5;
        padding: 20px;
    }
}

.van-nav-bar .van-icon{
    color: black;
}
.van-nav-bar__text{
    color: black;
}
</style>